<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
	<head>
		<meta http-equiv="content-type" content="text/html; charset=utf-8" />
		<meta name="generator" content="JsDoc Toolkit" />
		
		<title>JsDoc Reference - omAccordion</title>

		<style type="text/css">
			#index {
	margin-top: 24px;
	float: left;
	width: 160px;
	position: absolute;
	left: 8px;
	padding: 8px;
}

#content {
	margin-left: 190px;
	margin-right: 5px;
}

.classTitle {
    font-size: 32px;
    line-height: 130%;
    padding-top: 10px;
}

.detailList {
	line-height: 15px;
	margin-left: 20px;
}

.detailList dt {
	margin-left: 20px;
}

.detailList .heading {
	font-weight: bold;
	margin-left: 0;
	padding-bottom: 6px;
}

.fineprint {
	text-align: right;
	font-size: 10px;
}

		</style>
		<link type="text/css" rel="stylesheet" href="../css/docs.css">
		<script type="text/javascript" src="../js/jquery.js"></script>
		<script type="text/javascript" src="../js/om-core.js"></script>
		<script type="text/javascript" src="../js/om-panel.js"></script>
		<script type="text/javascript" src="../js/om-tabs.js"></script>
		<link type="text/css" rel="stylesheet" href="../css/om-core.css">
		<link type="text/css" rel="stylesheet" href="../css/om-theme.css">
		<link type="text/css" rel="stylesheet" href="../css/om-panel.css">
		<link type="text/css" rel="stylesheet" href="../css/om-tabs.css">
		<script type="text/javascript">
            $(function() {
            	$(".widget-docs").omTabs();
            	<!-- doc_script_begin -->
                $(".widget-docs > div").addClass('clearfix'); //This fixes clearing of containers
                //show details/hide details
                $("#options #options-list, #events #events-list").before('<div class="toggle-docs-links"><a class="toggle-docs-detail" href="#">显示描述</a> | <a class="toggle-docs-example" href="#">隐藏示例</a></div>');
            
                $("#methods #methods-list").before('<div class="toggle-docs-links"><a class="toggle-docs-detail" href="#">显示描述</a> | <a class="toggle-docs-example" href="#">隐藏示例</a></div>');

                var showExamples = true;
                $(".toggle-docs-detail").toggle(function(e){
                    var details = $(this).text("隐藏描述")
                        .parent().next().find("li > div:first-child").addClass("header-open");
                    if ( showExamples ) {
                        details.nextAll().show();
                    } else {
                        details.next().show();
                    }
                    e.preventDefault();
                },function(e){
                    $(this).text("显示描述")
                        .parent().next().find("li > div:first-child").removeClass("header-open")
                        .nextAll().hide();
                    e.preventDefault();
                });
            
                $(".toggle-docs-example").click(function(e){
                    if ( showExamples ) {
                        showExamples = false;
                        $(".toggle-docs-example").text("显示示例").parent().next().find("div.header-open ~ .option-examples, div.header-open ~ .event-examples, div.header-open ~ .method-examples").hide();
                    } else {
                        showExamples = true;
                        $(".toggle-docs-example").text("隐藏示例").parent().next().find("div.header-open ~ .option-examples, div.header-open ~ .event-examples, div.header-open ~ .method-examples").show();
                    }
                    e.preventDefault();
                });
                
                //Initially hide all options/methods/events
                $('div.option-description, div.option-examples, div.event-description, div.event-examples, div.method-description, div.method-examples').hide();
                
                //Make list items collapsible
                $('div.option-header h3, div.event-header h3, div.method-header h3').live('click', function() {
                    var details = $(this).parent().toggleClass('header-open');
                    if ( showExamples ) {
                        details.nextAll().toggle();
                    } else {
                        details.next().toggle();
                    }
                });
            });
            <!-- doc_script_end -->
        </script>
	</head>

	<body>
	<div id="wrapper">
<!-- ============================== header ================================= -->	
		<!-- begin static/header.html -->
		<div id="header">
</div>
		<!-- end static/header.html -->
		
<!-- ============================== classes index ============================ -->
        <div id="index">
            <!-- begin publish.classesIndex -->
            <div align="center"><a href="../index.html">Class Index</a>
| <a href="../files.html">File Index</a></div>
<hr />
<h2><span style="color:#E87B10">Classes</span></h2>
<table class="layout-grid" cellspacing="0" cellpadding="0">
    <tbody>
        <tr>
             <td class="left-nav">
                 <dl class="demos-nav">
                    
                    <dd><i><a href="../symbols/_global_.html">_global_</a></i></dd>
                    
                    <dd><a href="../symbols/omAccordion.html">omAccordion</a></dd>
                    
                    <dd><a href="../symbols/omAjaxSubmit.html">omAjaxSubmit</a></dd>
                    
                    <dd><a href="../symbols/omBorderLayout.html">omBorderLayout</a></dd>
                    
                    <dd><a href="../symbols/omButton.html">omButton</a></dd>
                    
                    <dd><a href="../symbols/omButtonbar.html">omButtonbar</a></dd>
                    
                    <dd><a href="../symbols/omCalendar.html">omCalendar</a></dd>
                    
                    <dd><a href="../symbols/omCombo.html">omCombo</a></dd>
                    
                    <dd><a href="../symbols/omDialog.html">omDialog</a></dd>
                    
                    <dd><a href="../symbols/omDraggable.html">omDraggable</a></dd>
                    
                    <dd><a href="../symbols/omDroppable.html">omDroppable</a></dd>
                    
                    <dd><a href="../symbols/omEditor.html">omEditor</a></dd>
                    
                    <dd><a href="../symbols/omFileUpload.html">omFileUpload</a></dd>
                    
                    <dd><a href="../symbols/omGrid.html">omGrid</a></dd>
                    
                    <dd><a href="../symbols/omItemSelector.html">omItemSelector</a></dd>
                    
                    <dd><a href="../symbols/omMenu.html">omMenu</a></dd>
                    
                    <dd><a href="../symbols/omMessageBox.html">omMessageBox</a></dd>
                    
                    <dd><a href="../symbols/omMessageTip.html">omMessageTip</a></dd>
                    
                    <dd><a href="../symbols/omNumberField.html">omNumberField</a></dd>
                    
                    <dd><a href="../symbols/omPanel.html">omPanel</a></dd>
                    
                    <dd><a href="../symbols/omProgressbar.html">omProgressbar</a></dd>
                    
                    <dd><a href="../symbols/omScrollbar.html">omScrollbar</a></dd>
                    
                    <dd><a href="../symbols/omSlider.html">omSlider</a></dd>
                    
                    <dd><a href="../symbols/omSuggestion.html">omSuggestion</a></dd>
                    
                    <dd><a href="../symbols/omTabs.html">omTabs</a></dd>
                    
                    <dd><a href="../symbols/omTooltip.html">omTooltip</a></dd>
                    
                    <dd><a href="../symbols/omTree.html">omTree</a></dd>
                    
                    <dd><a href="../symbols/validate.html">validate</a></dd>
                    
                 </dl>
             </td>
         </tr>
     </tbody>
</table>
            <!-- end publish.classesIndex -->
        </div>
        
        <div id="content">
<!-- ============================== class title ============================ -->
            <div class="classTitle">
                
                Class omAccordion
            </div>

        <!-- ============================== widget-docs ================================= -->
        <div class="widget-docs">
            <ul>
                <li><a href="#overview">预览</a></li>
                
                    
                    
                        <li><a href="#options">属性</a></li>
                    
                
                
                    
                    
                        <li><a href="#methods">方法</a></li>
                    
                
                
                    
                    
                        <li><a href="#events">事件</a></li>
                    
                
            </ul>
            <!-- doc_overview_begin -->
            <div id="overview" style="margin:14px 8px;">
                
                <p class="description">
                    <!-- ============================== class summary ========================== -->            
                    
                    
                
                    抽屉布局组件。以抽屉的形式展现信息，每个抽屉内容可为当前页面内容，也可以使用Ajax装载其他页面的内容，其原理是jQuery的load方法，没用到嵌入的iframe，不支持跨域装载.支持初始化过后再次更新某个抽屉的数据源(调用url方法)，值得注意的是:更新数据源不会触发抽屉的刷新操作，需要显示调用另一个api来完成(调用reload方法)。<br/><br/>
<b>特点：</b><br/>
<ol>
     <li>支持Ajax装载</li>
     <li>支持自定义每个抽屉图标</li>
     <li>支持多种抽屉切换方式</li>
     <li>支持动态更换数据源</li>
     <li>支持动态更换标题</li>
     <li>支持定时自动切换抽屉</li>
     <li>支持多种事件捕获</li>
</ol>
<b>使用方式：</b><br/><br/>
页面上有如下html标记
<pre>
&lt;script type="text/javascript" >
$(document).ready(function() {
    $('#make-accordion').omAccordion();
});
&lt;/script>

&lt;div id="make-accordion"&gt;
   &lt;ul&gt;
       &lt;li&gt;
           &lt;a href="./remote.html" id="accordion1"&gt;Title1&lt;/a&gt;&lt;!--此抽屉的id为accordion1，如果没有显示指定，会自动生成--&gt;
       &lt;/li&gt;
       &lt;li&gt;
            &lt;a href="#accordion2"&gt;Title2&lt;/a&gt;&lt;!--此抽屉的id为accordion2--&gt;
        &lt;/li&gt;
        &lt;li&gt;
            &lt;a href="#accordion3"&gt;Title3&lt;/a&gt;&lt;!--此抽屉的id为accordion3--&gt;
        &lt;/li&gt;
   &lt;/ul&gt;
   &lt;div id="accordion2"&gt;
     this is accordion2 content
   &lt;/div&gt;
   &lt;div id="accordion3"&gt;
     this is accordion3 content
   &lt;/div&gt;
&lt;/div&gt;
</pre>
                    <!--
                    
                        <br /><i>Defined in: </i> <a href="../symbols/src/ui__om-accordion.js.html">om-accordion.js</a>.
                    
                    -->
                </p>
                    <!-- ============================== class details ==================== -->        
                    
                    <div class="details"><a name="constructor"> </a>
                        <div class="option-name">
                                <b style="color: #1B75BB;">omAccordion</b>(p)
                        </div>
                        
                        <!--
                        <div class="description">
                            构造函数.
                        </div>
                        -->
                        
                        
                            
                                <dl class="detailList">
                                <dt class="heading">参数:</dt>
                                
                                    <dt>
                                         <b>p</b>&nbsp;-
                                        标准config对象：{width:500, height:300}
                                        
                                    </dt>
                                        
                                
                                </dl>
                            
                            
                            
                            
                            
                            
                            
        
                    </div>
                    
            </div>
            <!-- doc_overview_end -->
            
            	<!-- doc_options_begin -->
                <div id="options">
                    <!-- ============================== field details ========================== -->        
                    <h2 class="top-header">属性</h2>
                    <div id="options-list">
	                    <ul class="options-list">
	                            
	                            
	                                <li class="option" id="option-active">
	                                  <div class="option-header">
	                                    <h3 class="option-name"><a href="#" onclick="return false;">active</a></h3>
	                                    <dl>
	                                      
	                                      <dt class="option-type-label">Type:</dt>
	                                        <dd class="option-type">
	                                        &nbsp;
	                                        <span>Number String</span></dd>
	                                      
	                                      
	                                      <dt class="option-default-label">Default:</dt>
	                                        <dd class="option-default">0</dd>
	                                      
	                                    </dl>
	                                  </div>
	                                  <div class="option-description">
	                                    <p>
	                                        抽屉布局首次展现时，默认展开的抽屉的索引，可以为整数,也可以为抽屉的id,获取当前处于激活状态的抽屉id可用getActivated()方法。<br/>
如果创建组件时想所有抽屉都不展开，可以这样创建<br/>
$('#make-accordion').omAccordion({collapsible:true,active:-1});<br/>
组件会优先按id进行处理，如果找不到对应抽屉，则以索引处理，在处理索引时，将会用parseInt及isNaN进行处理。<br/>
<ul>
<li>如果抽屉个数为0，则active=-1，</li>
<li>如果抽屉个数大于0，且active小于0(当为-1时并且collapsible!==false，则可以收起所有抽屉)，则active=0，</li>
<li>如果抽屉个数大于0，且active大于抽屉的个数，则active=抽屉的个数-1</li>
</ul>
	                                        
	                                        
	                                        
	                                        <!-- handler the other member -->
	                                        
	                                        
	                                        
	                                    </p>
	                                  </div>
	                                     
	                                      <div class="option-examples">
	                                        <h4>示例：</h4>
	                                        <dl class="option-examples-list">
	                                     
	                                        
	                                        <dd>
	                                        <pre>//激活第一个抽屉
$('#make-accordion').omAccordion({active: 1});
//激活id为'contentId'的抽屉
$('#make-accordion').omAccordion({active: 'contentId'});
//收起所有的抽屉(这时必须有collapsible!==false)
$('#make-accordion').omAccordion({active:-1});</pre>
	                                        </dd>
	                                        
	                                        </dl>
	                                      </div>
	                                       
	                                </li>
	                            
	                            
	                                <li class="option" id="option-autoPlay">
	                                  <div class="option-header">
	                                    <h3 class="option-name"><a href="#" onclick="return false;">autoPlay</a></h3>
	                                    <dl>
	                                      
	                                      <dt class="option-type-label">Type:</dt>
	                                        <dd class="option-type">
	                                        &nbsp;
	                                        <span>Boolean</span></dd>
	                                      
	                                      
	                                      <dt class="option-default-label">Default:</dt>
	                                        <dd class="option-default">false</dd>
	                                      
	                                    </dl>
	                                  </div>
	                                  <div class="option-description">
	                                    <p>
	                                        是否自动循环切换抽屉。跟interval配合使用，interval用来指定切换的时间间隔。
	                                        
	                                        
	                                        
	                                        <!-- handler the other member -->
	                                        
	                                        
	                                        
	                                    </p>
	                                  </div>
	                                     
	                                      <div class="option-examples">
	                                        <h4>示例：</h4>
	                                        <dl class="option-examples-list">
	                                     
	                                        
	                                        <dd>
	                                        <pre>//自动循环切换抽屉
$('#make-accordion').omAccordion({autoPlay: true});</pre>
	                                        </dd>
	                                        
	                                        </dl>
	                                      </div>
	                                       
	                                </li>
	                            
	                            
	                                <li class="option" id="option-collapsible">
	                                  <div class="option-header">
	                                    <h3 class="option-name"><a href="#" onclick="return false;">collapsible</a></h3>
	                                    <dl>
	                                      
	                                      <dt class="option-type-label">Type:</dt>
	                                        <dd class="option-type">
	                                        &nbsp;
	                                        <span>Boolean</span></dd>
	                                      
	                                      
	                                      <dt class="option-default-label">Default:</dt>
	                                        <dd class="option-default">false</dd>
	                                      
	                                    </dl>
	                                  </div>
	                                  <div class="option-description">
	                                    <p>
	                                        是否允许将所有抽屉收起。当该值为true时，点击已经展开的抽屉时该抽屉被收起，结果所有抽屉都处于收起状态。（默认情况下不可以收起该抽屉，任一时刻总有一个抽屉是处于激活状态的）。
	                                        
	                                        
	                                        
	                                        <!-- handler the other member -->
	                                        
	                                        
	                                        
	                                    </p>
	                                  </div>
	                                     
	                                      <div class="option-examples">
	                                        <h4>示例：</h4>
	                                        <dl class="option-examples-list">
	                                     
	                                        
	                                        <dd>
	                                        <pre>//设置可以收起所有的抽屉
$('#make-accordion').omAccordion({collapsible :true});<br/>
//接着再执行下边代码就可以收起所有抽屉了
$('#make-accordion').omAccordion({active : -1});<br/></pre>
	                                        </dd>
	                                        
	                                        </dl>
	                                      </div>
	                                       
	                                </li>
	                            
	                            
	                                <li class="option" id="option-disabled">
	                                  <div class="option-header">
	                                    <h3 class="option-name"><a href="#" onclick="return false;">disabled</a></h3>
	                                    <dl>
	                                      
	                                      <dt class="option-type-label">Type:</dt>
	                                        <dd class="option-type">
	                                        &nbsp;
	                                        <span>Boolean</span></dd>
	                                      
	                                      
	                                      <dt class="option-default-label">Default:</dt>
	                                        <dd class="option-default">false</dd>
	                                      
	                                    </dl>
	                                  </div>
	                                  <div class="option-description">
	                                    <p>
	                                        是否禁用组件。如果禁用，则不可以对抽屉进行任何操作。
	                                        
	                                        
	                                        
	                                        <!-- handler the other member -->
	                                        
	                                        
	                                        
	                                    </p>
	                                  </div>
	                                     
	                                      <div class="option-examples">
	                                        <h4>示例：</h4>
	                                        <dl class="option-examples-list">
	                                     
	                                        
	                                        <dd>
	                                        <pre>$('#make-accordion').omAccordion({disabled:true});</pre>
	                                        </dd>
	                                        
	                                        </dl>
	                                      </div>
	                                       
	                                </li>
	                            
	                            
	                                <li class="option" id="option-header">
	                                  <div class="option-header">
	                                    <h3 class="option-name"><a href="#" onclick="return false;">header</a></h3>
	                                    <dl>
	                                      
	                                      <dt class="option-type-label">Type:</dt>
	                                        <dd class="option-type">
	                                        &nbsp;
	                                        <span>String</span></dd>
	                                      
	                                      
	                                      <dt class="option-default-label">Default:</dt>
	                                        <dd class="option-default">'> ul:first li'</dd>
	                                      
	                                    </dl>
	                                  </div>
	                                  <div class="option-description">
	                                    <p>
	                                        头部元素选择器。用来指明组件创建时如何获取各个抽屉的初始信息。
	                                        
	                                        
	                                        
	                                        <!-- handler the other member -->
	                                        
	                                        
	                                        
	                                    </p>
	                                  </div>
	                                     
	                                      <div class="option-examples">
	                                        <h4>示例：</h4>
	                                        <dl class="option-examples-list">
	                                     
	                                        
	                                        <dd>
	                                        <pre>$('#make-accordion').omAccordion({header:'>h3'});</pre>
	                                        </dd>
	                                        
	                                        </dl>
	                                      </div>
	                                       
	                                </li>
	                            
	                            
	                                <li class="option" id="option-height">
	                                  <div class="option-header">
	                                    <h3 class="option-name"><a href="#" onclick="return false;">height</a></h3>
	                                    <dl>
	                                      
	                                      <dt class="option-type-label">Type:</dt>
	                                        <dd class="option-type">
	                                        &nbsp;
	                                        <span>Number,String</span></dd>
	                                      
	                                      
	                                      <dt class="option-default-label">Default:</dt>
	                                        <dd class="option-default">'auto'</dd>
	                                      
	                                    </dl>
	                                  </div>
	                                  <div class="option-description">
	                                    <p>
	                                        抽屉布局的高度，可取值为'auto'（每个抽屉的高度分别由抽屉的内容决定），可以取值为'fit'，表示适应父容器的大小（height:100%）。任何其他的值（比如百分比、数字、em单位、px单位的值等等）将被直接赋给height属性。
	                                        
	                                        
	                                        
	                                        <!-- handler the other member -->
	                                        
	                                        
	                                        
	                                    </p>
	                                  </div>
	                                     
	                                      <div class="option-examples">
	                                        <h4>示例：</h4>
	                                        <dl class="option-examples-list">
	                                     
	                                        
	                                        <dd>
	                                        <pre>$('#make-accordion').omAccordion({height: '50%'});</pre>
	                                        </dd>
	                                        
	                                        </dl>
	                                      </div>
	                                       
	                                </li>
	                            
	                            
	                                <li class="option" id="option-iconCls">
	                                  <div class="option-header">
	                                    <h3 class="option-name"><a href="#" onclick="return false;">iconCls</a></h3>
	                                    <dl>
	                                      
	                                      <dt class="option-type-label">Type:</dt>
	                                        <dd class="option-type">
	                                        &nbsp;
	                                        <span>String</span></dd>
	                                      
	                                      
	                                      <dt class="option-default-label">Default:</dt>
	                                        <dd class="option-default">无</dd>
	                                      
	                                    </dl>
	                                  </div>
	                                  <div class="option-description">
	                                    <p>
	                                        每个抽屉的header前面可以配置一个小图标，iconCls为该小图标的样式。该图标的配置与其他属性不同，不是配置在config对象中，而是作为DOM结构中 &lt;a&gt; 标签的属性而存在。
在上面的demo"简单抽屉"中可以看到完整的示例。
	                                        
	                                        
	                                        
	                                        <!-- handler the other member -->
	                                        
	                                        
	                                        
	                                    </p>
	                                  </div>
	                                     
	                                      <div class="option-examples">
	                                        <h4>示例：</h4>
	                                        <dl class="option-examples-list">
	                                     
	                                        
	                                        <dd>
	                                        <pre>//DOM树结构，注意a标签上的iconCls
&lt;div id="make-accordion"&gt;
 &lt;ul&gt;
     &lt;li&gt;
         &lt;a iconCls="file-save" href="#accordion-1"&gt;&lt;/a&gt;
     &lt;/li&gt;
 &lt;/ul&gt;
 &lt;div id="accordion-1"&gt;
     This is Accordion-1
 &lt;/div&gt;
&lt;/div&gt;</pre>
	                                        </dd>
	                                        
	                                        </dl>
	                                      </div>
	                                       
	                                </li>
	                            
	                            
	                                <li class="option" id="option-interval">
	                                  <div class="option-header">
	                                    <h3 class="option-name"><a href="#" onclick="return false;">interval</a></h3>
	                                    <dl>
	                                      
	                                      <dt class="option-type-label">Type:</dt>
	                                        <dd class="option-type">
	                                        &nbsp;
	                                        <span>Number</span></dd>
	                                      
	                                      
	                                      <dt class="option-default-label">Default:</dt>
	                                        <dd class="option-default">1000</dd>
	                                      
	                                    </dl>
	                                  </div>
	                                  <div class="option-description">
	                                    <p>
	                                        当自动循环切换抽屉（将autoPlay设置true）时，两次切换动作之间的时间间隔，单位为毫秒。
	                                        
	                                        
	                                        
	                                        <!-- handler the other member -->
	                                        
	                                        
	                                        
	                                    </p>
	                                  </div>
	                                     
	                                      <div class="option-examples">
	                                        <h4>示例：</h4>
	                                        <dl class="option-examples-list">
	                                     
	                                        
	                                        <dd>
	                                        <pre>//每隔2s自动切换抽屉
$('#make-accordion').omAccordion({autoPlay: true, interval : 2000});</pre>
	                                        </dd>
	                                        
	                                        </dl>
	                                      </div>
	                                       
	                                </li>
	                            
	                            
	                                <li class="option" id="option-switchEffect">
	                                  <div class="option-header">
	                                    <h3 class="option-name"><a href="#" onclick="return false;">switchEffect</a></h3>
	                                    <dl>
	                                      
	                                      <dt class="option-type-label">Type:</dt>
	                                        <dd class="option-type">
	                                        &nbsp;
	                                        <span>Boolean</span></dd>
	                                      
	                                      
	                                      <dt class="option-default-label">Default:</dt>
	                                        <dd class="option-default">false</dd>
	                                      
	                                    </dl>
	                                  </div>
	                                  <div class="option-description">
	                                    <p>
	                                        抽屉切换时是否需要动画效果，若启用动画效果，则使用jQuery的slideUp和slideDown，动画速度为fast， 动画效果不可定制。
	                                        
	                                        
	                                        
	                                        <!-- handler the other member -->
	                                        
	                                        
	                                        
	                                    </p>
	                                  </div>
	                                     
	                                      <div class="option-examples">
	                                        <h4>示例：</h4>
	                                        <dl class="option-examples-list">
	                                     
	                                        
	                                        <dd>
	                                        <pre>//收起和展开抽屉时使用动画效果
$('#make-accordion').omAccordion({switchEffect: true});</pre>
	                                        </dd>
	                                        
	                                        </dl>
	                                      </div>
	                                       
	                                </li>
	                            
	                            
	                                <li class="option" id="option-switchMode">
	                                  <div class="option-header">
	                                    <h3 class="option-name"><a href="#" onclick="return false;">switchMode</a></h3>
	                                    <dl>
	                                      
	                                      <dt class="option-type-label">Type:</dt>
	                                        <dd class="option-type">
	                                        &nbsp;
	                                        <span>String</span></dd>
	                                      
	                                      
	                                      <dt class="option-default-label">Default:</dt>
	                                        <dd class="option-default">"click"</dd>
	                                      
	                                    </dl>
	                                  </div>
	                                  <div class="option-description">
	                                    <p>
	                                        抽屉切换的方式。取值为下面的2种之一: "click"、"mouseover"。click表示单击切换，mouseover表示鼠标滑过切换。
	                                        
	                                        
	                                        
	                                        <!-- handler the other member -->
	                                        
	                                        
	                                        
	                                    </p>
	                                  </div>
	                                     
	                                      <div class="option-examples">
	                                        <h4>示例：</h4>
	                                        <dl class="option-examples-list">
	                                     
	                                        
	                                        <dd>
	                                        <pre>//鼠标滑过切换抽屉
$('#make-accordion').omAccordion({switchMode: 'mouseover'});</pre>
	                                        </dd>
	                                        
	                                        </dl>
	                                      </div>
	                                       
	                                </li>
	                            
	                            
	                                <li class="option" id="option-width">
	                                  <div class="option-header">
	                                    <h3 class="option-name"><a href="#" onclick="return false;">width</a></h3>
	                                    <dl>
	                                      
	                                      <dt class="option-type-label">Type:</dt>
	                                        <dd class="option-type">
	                                        &nbsp;
	                                        <span>Number,String</span></dd>
	                                      
	                                      
	                                      <dt class="option-default-label">Default:</dt>
	                                        <dd class="option-default">'auto'</dd>
	                                      
	                                    </dl>
	                                  </div>
	                                  <div class="option-description">
	                                    <p>
	                                        抽屉布局的宽度，可取值为'auto'（默认情况,由浏览器决定宽度），可以取值为'fit'，表示适应父容器的大小（width:100%）。任何其他的值（比如百分比、数字、em单位、px单位的值等等）将被直接赋给width属性。
	                                        
	                                        
	                                        
	                                        <!-- handler the other member -->
	                                        
	                                        
	                                        
	                                    </p>
	                                  </div>
	                                     
	                                      <div class="option-examples">
	                                        <h4>示例：</h4>
	                                        <dl class="option-examples-list">
	                                     
	                                        
	                                        <dd>
	                                        <pre>$('#make-accordion').omAccordion({width: 500});</pre>
	                                        </dd>
	                                        
	                                        </dl>
	                                      </div>
	                                       
	                                </li>
	                            
	                    </ul>
                   </div>
                </div>
                <!-- doc_options_end -->
            
            
            	<!-- doc_methods_begin -->
                <div id="methods">
                    <!-- ============================== methods details ======================== -->
                    <h2 class="top-header">方法</h2>
                    <div id="methods-list">
	                    <ul class="methods-list">
	                        
	                            <li class="method" id="method-activate">
	                              <div class="method-header">
	                                <h3 class="method-name"><a href="#" onclick="return false;">activate</a></h3>
	                                <dl>
	                                    <dt class="method-signature-label">Signature:</dt>
	                                    <dd class="method-signature">&nbsp;
	                                        
	                                        <b><a href="../symbols/omAccordion.html#activate">activate</a></b>(index)
	                                    </dd>
	                                </dl>
	                              </div>
	                              <div class="method-description">
	                                <p>
	                                    激活指定的抽屉。index为整数或者抽屉的id。<br/>
任何其它数据将会用parseInt及isNaN进行处理。
(注意，如果组件为禁用状态，执行此方法无任何效果)
<ul>
<li>如果抽屉个数为0，则不激活任何抽屉</li>
<li>如果抽屉个数大于0，且index<0，则激活第一个抽屉(索引为0的那个抽屉)</li>
<li>如果抽屉个数大于0，且index>=抽屉的个数，则激活最后一个抽屉</li>
</ul>
	                                    
	                                    
	    
	                                    <!-- do the other params -->
	                                    
	                                        <dl class="detailList">
	                                        <dt class="heading">参数:</dt>
	                                        
	                                            <dt>
	                                                <b>index</b>&nbsp;-
	                                                要激活的抽屉的索引(从0开始)或者抽屉的id
	                                                
	                                            </dt>
	                                        
	                                        </dl>
	                                    
	                                    
	                                    
	                                    
	                                    
	                                    
	                                    
	                                </p>
	                              </div>
	                              
	                                  <div class="method-examples">
	                                    <h4>示例：</h4>
	                                    <dl class="method-examples-list">
	                                    
	                                        <dd>
	                                        <pre>$('#make-accordion').omAccordion('activate', '1');</pre>
	                                        </dd>
	                                    
	                                    </dl>
	                                  </div>
	                             
	                        </li>
	                    
	                            <li class="method" id="method-disable">
	                              <div class="method-header">
	                                <h3 class="method-name"><a href="#" onclick="return false;">disable</a></h3>
	                                <dl>
	                                    <dt class="method-signature-label">Signature:</dt>
	                                    <dd class="method-signature">&nbsp;
	                                        
	                                        <b><a href="../symbols/omAccordion.html#disable">disable</a></b>()
	                                    </dd>
	                                </dl>
	                              </div>
	                              <div class="method-description">
	                                <p>
	                                    禁用整个抽屉组件。
	                                    
	                                    
	    
	                                    <!-- do the other params -->
	                                    
	                                    
	                                    
	                                    
	                                    
	                                    
	                                    
	                                </p>
	                              </div>
	                              
	                                  <div class="method-examples">
	                                    <h4>示例：</h4>
	                                    <dl class="method-examples-list">
	                                    
	                                        <dd>
	                                        <pre>$('#make-accordion').omAccordion('disable');</pre>
	                                        </dd>
	                                    
	                                    </dl>
	                                  </div>
	                             
	                        </li>
	                    
	                            <li class="method" id="method-enable">
	                              <div class="method-header">
	                                <h3 class="method-name"><a href="#" onclick="return false;">enable</a></h3>
	                                <dl>
	                                    <dt class="method-signature-label">Signature:</dt>
	                                    <dd class="method-signature">&nbsp;
	                                        
	                                        <b><a href="../symbols/omAccordion.html#enable">enable</a></b>()
	                                    </dd>
	                                </dl>
	                              </div>
	                              <div class="method-description">
	                                <p>
	                                    使整个抽屉处于可用状态(即非禁用状态)
	                                    
	                                    
	    
	                                    <!-- do the other params -->
	                                    
	                                    
	                                    
	                                    
	                                    
	                                    
	                                    
	                                </p>
	                              </div>
	                              
	                                  <div class="method-examples">
	                                    <h4>示例：</h4>
	                                    <dl class="method-examples-list">
	                                    
	                                        <dd>
	                                        <pre>$('#make-accordion').omAccordion('enable');</pre>
	                                        </dd>
	                                    
	                                    </dl>
	                                  </div>
	                             
	                        </li>
	                    
	                            <li class="method" id="method-getActivated">
	                              <div class="method-header">
	                                <h3 class="method-name"><a href="#" onclick="return false;">getActivated</a></h3>
	                                <dl>
	                                    <dt class="method-signature-label">Signature:</dt>
	                                    <dd class="method-signature">&nbsp;
	                                        
	                                        <b><a href="../symbols/omAccordion.html#getActivated">getActivated</a></b>()
	                                    </dd>
	                                </dl>
	                              </div>
	                              <div class="method-description">
	                                <p>
	                                    获取当前处于激活状态的抽屉的id,如果抽屉总数为0或者当前没有抽屉处于激活状态，那么返回null<br/>
抽屉的id在创建时可以自行指定，如果没有指定，组件内部会动态产生一个。<br/>
//DOM树结构，注意，下面代码创建后的抽屉的id为accordion-1.<br/>
<pre>
&lt;div id="make-accordion"&gt;
 &lt;ul&gt;
     &lt;li&gt;
         &lt;a iconCls="file-save" href="#accordion-1"&gt;&lt;/a&gt;
     &lt;/li&gt;
 &lt;/ul&gt;
 &lt;div id="accordion-1"&gt;
     This is Accordion-1
 &lt;/div&gt;
&lt;/div&gt;
</pre>
	                                    
	                                    
	    
	                                    <!-- do the other params -->
	                                    
	                                    
	                                    
	                                    
	                                    
	                                        <dl class="detailList">
	                                        <dt class="heading">返回:</dt>
	                                        
	                                            <dd>当前处于激活状态的抽屉的id</dd>
	                                        
	                                        </dl>
	                                    
	                                    
	                                    
	                                </p>
	                              </div>
	                              
	                                  <div class="method-examples">
	                                    <h4>示例：</h4>
	                                    <dl class="method-examples-list">
	                                    
	                                        <dd>
	                                        <pre>$('#make-accordion').omAccordion('getActivated');</pre>
	                                        </dd>
	                                    
	                                    </dl>
	                                  </div>
	                             
	                        </li>
	                    
	                            <li class="method" id="method-getLength">
	                              <div class="method-header">
	                                <h3 class="method-name"><a href="#" onclick="return false;">getLength</a></h3>
	                                <dl>
	                                    <dt class="method-signature-label">Signature:</dt>
	                                    <dd class="method-signature">&nbsp;
	                                        
	                                        <b><a href="../symbols/omAccordion.html#getLength">getLength</a></b>()
	                                    </dd>
	                                </dl>
	                              </div>
	                              <div class="method-description">
	                                <p>
	                                    获取抽屉的总数。
	                                    
	                                    
	    
	                                    <!-- do the other params -->
	                                    
	                                    
	                                    
	                                    
	                                    
	                                        <dl class="detailList">
	                                        <dt class="heading">返回:</dt>
	                                        
	                                            <dd>len 抽屉的总数</dd>
	                                        
	                                        </dl>
	                                    
	                                    
	                                    
	                                </p>
	                              </div>
	                              
	                                  <div class="method-examples">
	                                    <h4>示例：</h4>
	                                    <dl class="method-examples-list">
	                                    
	                                        <dd>
	                                        <pre>var len = $('#make-accordion').omAccordion('getLength');
alert('total lenght of accordoins is : ' + len);</pre>
	                                        </dd>
	                                    
	                                    </dl>
	                                  </div>
	                             
	                        </li>
	                    
	                            <li class="method" id="method-reload">
	                              <div class="method-header">
	                                <h3 class="method-name"><a href="#" onclick="return false;">reload</a></h3>
	                                <dl>
	                                    <dt class="method-signature-label">Signature:</dt>
	                                    <dd class="method-signature">&nbsp;
	                                        
	                                        <b><a href="../symbols/omAccordion.html#reload">reload</a></b>(index)
	                                    </dd>
	                                </dl>
	                              </div>
	                              <div class="method-description">
	                                <p>
	                                    重新装载指定抽屉的内容.如果该抽屉的数据源是url，则根据该url去取内容，如果该抽屉的数据源是普通文本，则什么都不会做。
	                                    
	                                    
	    
	                                    <!-- do the other params -->
	                                    
	                                        <dl class="detailList">
	                                        <dt class="heading">参数:</dt>
	                                        
	                                            <dt>
	                                                <b>index</b>&nbsp;-
	                                                要重新装载内容的抽屉的索引（从0开始计数）或者是抽屉的id
	                                                
	                                            </dt>
	                                        
	                                        </dl>
	                                    
	                                    
	                                    
	                                    
	                                    
	                                    
	                                    
	                                </p>
	                              </div>
	                              
	                                  <div class="method-examples">
	                                    <h4>示例：</h4>
	                                    <dl class="method-examples-list">
	                                    
	                                        <dd>
	                                        <pre>//重新装载索引为1的抽屉
$('#make-accordion').omAccordion('reload', 1);</pre>
	                                        </dd>
	                                    
	                                    </dl>
	                                  </div>
	                             
	                        </li>
	                    
	                            <li class="method" id="method-setTitle">
	                              <div class="method-header">
	                                <h3 class="method-name"><a href="#" onclick="return false;">setTitle</a></h3>
	                                <dl>
	                                    <dt class="method-signature-label">Signature:</dt>
	                                    <dd class="method-signature">&nbsp;
	                                        
	                                        <b><a href="../symbols/omAccordion.html#setTitle">setTitle</a></b>(index, title)
	                                    </dd>
	                                </dl>
	                              </div>
	                              <div class="method-description">
	                                <p>
	                                    设置指定抽屉的标题，标题内容可以为html文本。
	                                    
	                                    
	    
	                                    <!-- do the other params -->
	                                    
	                                        <dl class="detailList">
	                                        <dt class="heading">参数:</dt>
	                                        
	                                            <dt>
	                                                <b>index</b>&nbsp;-
	                                                要改变标题的抽屉的索引（从0开始计数）或者是抽屉的id
	                                                
	                                            </dt>
	                                        
	                                            <dt>
	                                                <b>title</b>&nbsp;-
	                                                新的标题，内容可以为html
	                                                
	                                            </dt>
	                                        
	                                        </dl>
	                                    
	                                    
	                                    
	                                    
	                                    
	                                    
	                                    
	                                </p>
	                              </div>
	                              
	                                  <div class="method-examples">
	                                    <h4>示例：</h4>
	                                    <dl class="method-examples-list">
	                                    
	                                        <dd>
	                                        <pre>$('#make-accordion').omAccordion('setTitle',0,'apusic').omAccordion('setTitle',1,'AOM');</pre>
	                                        </dd>
	                                    
	                                    </dl>
	                                  </div>
	                             
	                        </li>
	                    
	                            <li class="method" id="method-url">
	                              <div class="method-header">
	                                <h3 class="method-name"><a href="#" onclick="return false;">url</a></h3>
	                                <dl>
	                                    <dt class="method-signature-label">Signature:</dt>
	                                    <dd class="method-signature">&nbsp;
	                                        
	                                        <b><a href="../symbols/omAccordion.html#url">url</a></b>(index)
	                                    </dd>
	                                </dl>
	                              </div>
	                              <div class="method-description">
	                                <p>
	                                    重新设置指定抽屉的数据源。注意该方法只会重新设置数据源，而不会主动去装载。<br/>
重新装载需要调用另一个api : $('make-accordion').omAccordion('reload',1);<br/>
如果需要更换内容的抽屉并不是用url去装载的，可以用如下方法更换:<br/>
$("#accordionId").find("#accordion-2").html("我们是AOM，一个神奇的团队");<br/>
其中accordion-2为抽屉的id.
	                                    
	                                    
	    
	                                    <!-- do the other params -->
	                                    
	                                        <dl class="detailList">
	                                        <dt class="heading">参数:</dt>
	                                        
	                                            <dt>
	                                                <b>index</b>&nbsp;-
	                                                要重新设置数据源的抽屉的索引（从0开始计数）
	                                                
	                                            </dt>
	                                        
	                                        </dl>
	                                    
	                                    
	                                    
	                                    
	                                    
	                                    
	                                    
	                                </p>
	                              </div>
	                              
	                                  <div class="method-examples">
	                                    <h4>示例：</h4>
	                                    <dl class="method-examples-list">
	                                    
	                                        <dd>
	                                        <pre>//重新设置第二个抽屉的数据源，然后重新装载该抽屉的内容
$('#make-accordion').omAccordion( 'url', 1, './ajax/content2.html' );
$('#make-accordion').omAccordion( 'reload',1 );</pre>
	                                        </dd>
	                                    
	                                    </dl>
	                                  </div>
	                             
	                        </li>
	                    
	                </ul>
                </div>
            </div>
            <!-- doc_methods_end -->
        
        
          <!-- doc_events_begin -->
          <div id="events">
            <!-- ============================== event details ========================= -->     
            <h2 class="top-header">事件</h2>
            <div id="events-list">
	            <ul class="events-list">
	                
	                    <li class="event" id="event-onActivate">
	                      <div class="event-header">
	                        <h3 class="event-name"><a href="#" onclick="return false;">onActivate</a></h3>
	                        <dl>
	                          <dt class="event-type-label"><dt class="event-type"></dt>
	                            
	                            function(index, event)
	                            </dt>
	                        </dl>
	                      </div>
	                      <div class="event-description">
	                        <p>
	                            激活一个抽屉时执行的方法
	                            
	                            
	                            
	                            <!-- handler the other members -->
	                            
	                                <dl class="detailList">
	                                <dt class="heading">参数:</dt>
	                                
	                                    <dt>
	                                        <b>index</b>&nbsp;-
	                                        被激活的抽屉的索引，从0开始计数。
	                                        
	                                    </dt>
	                                
	                                    <dt>
	                                        <b>event</b>&nbsp;-
	                                        jQuery.Event对象。
	                                        
	                                    </dt>
	                                
	                                </dl>
	                            
	                            
	                            
	                            
	                            
	                            
	                            
	                        </p>
	                      </div>
	                      
	                      
	                          <div class="event-examples">
	                            <h4>示例</h4>
	                            <dl class="event-examples-list">
	                                
	                                    <dd>
	                                    <pre> $('#make-accordion').omAccordion({
     onActivate : function(index, event) {
         alert('accordion ' + index + ' has been activated!');
     }
 });</pre>
	                                    </dd>
	                                
	                            </dl>
	                          </div>
	                      
	                    </li>
	                
	                    <li class="event" id="event-onBeforeActivate">
	                      <div class="event-header">
	                        <h3 class="event-name"><a href="#" onclick="return false;">onBeforeActivate</a></h3>
	                        <dl>
	                          <dt class="event-type-label"><dt class="event-type"></dt>
	                            
	                            function(index, event)
	                            </dt>
	                        </dl>
	                      </div>
	                      <div class="event-description">
	                        <p>
	                            激活一个抽屉之前执行的方法。
如果返回布尔值false,那么对应抽屉将不会激活。
	                            
	                            
	                            
	                            <!-- handler the other members -->
	                            
	                                <dl class="detailList">
	                                <dt class="heading">参数:</dt>
	                                
	                                    <dt>
	                                        <b>index</b>&nbsp;-
	                                        被选择的抽屉的索引，从0开始计数。
	                                        
	                                    </dt>
	                                
	                                    <dt>
	                                        <b>event</b>&nbsp;-
	                                        jQuery.Event对象。
	                                        
	                                    </dt>
	                                
	                                </dl>
	                            
	                            
	                            
	                            
	                            
	                            
	                            
	                        </p>
	                      </div>
	                      
	                      
	                          <div class="event-examples">
	                            <h4>示例</h4>
	                            <dl class="event-examples-list">
	                                
	                                    <dd>
	                                    <pre> $('#make-accordion').omAccordion({
     onBeforeActivate : function(index, event) {
         alert('accordion ' + index + ' will be activated!');
     }
 });</pre>
	                                    </dd>
	                                
	                            </dl>
	                          </div>
	                      
	                    </li>
	                
	                    <li class="event" id="event-onBeforeCollapse">
	                      <div class="event-header">
	                        <h3 class="event-name"><a href="#" onclick="return false;">onBeforeCollapse</a></h3>
	                        <dl>
	                          <dt class="event-type-label"><dt class="event-type"></dt>
	                            
	                            function(index, event)
	                            </dt>
	                        </dl>
	                      </div>
	                      <div class="event-description">
	                        <p>
	                            收起一个抽屉前执行的方法。
如果返回布尔值false,那么对应抽屉将不会被收起。
	                            
	                            
	                            
	                            <!-- handler the other members -->
	                            
	                                <dl class="detailList">
	                                <dt class="heading">参数:</dt>
	                                
	                                    <dt>
	                                        <b>index</b>&nbsp;-
	                                        被收起的抽屉的索引，从0开始计数。
	                                        
	                                    </dt>
	                                
	                                    <dt>
	                                        <b>event</b>&nbsp;-
	                                        jQuery.Event对象。
	                                        
	                                    </dt>
	                                
	                                </dl>
	                            
	                            
	                            
	                            
	                            
	                            
	                            
	                        </p>
	                      </div>
	                      
	                      
	                          <div class="event-examples">
	                            <h4>示例</h4>
	                            <dl class="event-examples-list">
	                                
	                                    <dd>
	                                    <pre> $('#make-accordion').omAccordion({
     onBeforeCollapse : function(index, event) {
         alert('accordion ' + index + ' will been collapsed!');
     }
 });</pre>
	                                    </dd>
	                                
	                            </dl>
	                          </div>
	                      
	                    </li>
	                
	                    <li class="event" id="event-onCollapse">
	                      <div class="event-header">
	                        <h3 class="event-name"><a href="#" onclick="return false;">onCollapse</a></h3>
	                        <dl>
	                          <dt class="event-type-label"><dt class="event-type"></dt>
	                            
	                            function(index, event)
	                            </dt>
	                        </dl>
	                      </div>
	                      <div class="event-description">
	                        <p>
	                            收起一个抽屉时执行的方法。
	                            
	                            
	                            
	                            <!-- handler the other members -->
	                            
	                                <dl class="detailList">
	                                <dt class="heading">参数:</dt>
	                                
	                                    <dt>
	                                        <b>index</b>&nbsp;-
	                                        被收起的抽屉的索引，从0开始计数。
	                                        
	                                    </dt>
	                                
	                                    <dt>
	                                        <b>event</b>&nbsp;-
	                                        jQuery.Event对象。
	                                        
	                                    </dt>
	                                
	                                </dl>
	                            
	                            
	                            
	                            
	                            
	                            
	                            
	                        </p>
	                      </div>
	                      
	                      
	                          <div class="event-examples">
	                            <h4>示例</h4>
	                            <dl class="event-examples-list">
	                                
	                                    <dd>
	                                    <pre> $('#make-accordion').omAccordion({
     onCollapse : function(index, event) {
         alert('accordion ' + index + ' has been collapsed!');
     }
 });</pre>
	                                    </dd>
	                                
	                            </dl>
	                          </div>
	                      
	                    </li>
	                
	            </ul>
            </div>
          </div>
          <!-- doc_events_end -->
       
       
    </div>

<!-- ============================== footer ================================= -->
		<div class="fineprint" style="clear:both">
			
			Documentation generated by <a href="http://code.google.com/p/jsdoc-toolkit/" target="_blank">JsDoc Toolkit</a> 2.4.0 on Wed Feb 06 2013 16:18:10 GMT+0800 (CST)
		</div>
		</div>
	</body>
</html>
